<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>17.数组转换为字符串</title>
  <script>
    // 1. 数组转换为字符串: 返回一个新字符串，原数组不受影响
    // a. 数组.toString() 将我们的数组转换为字符串
    var arr = [1, 2, 3, 43];
    console.log(arr.toString()); // 1, 2, 3, 43

    // b. 数组.join('分隔符') 将我们的数组转换为字符串，但是可以指定分隔符
    console.log(arr.join('-'));

    // 2. 数组名1.concat(数组名2, 数组名3...) 连接两个或者多个数组，返回新数组，不影响原数组
    var arr1 = [1, 2, 34, 1];
    var arr2 = [12, 211, 4, 1];
    var arr3 = [2, 1, 4, 1];
    console.log(arr1.concat(arr2, arr3));

    // a. 将值连接到数组
    console.log(arr1.concat('pink', ['老师', '爱了']));

    // b. 合并嵌套数组
    var arr1 = [[1]];
    console.log(arr1.concat([2, [3]]));     // [[1], 2, [3]]
    console.log(arr1.concat(4, [5, [6]]));  // [[1], 4, 5, [6]]
    console.log(arr1[0].push(1));
    console.log(arr1); // [[1,1]]

    // 3. splice() 通过删除或者替换现有数组元素 或者 在原地添加新元素来修改数组，并以数组的形式返回被修改的内容（原数组会被修改）
    // start: 开始下标 从0开始
    // num  : 元素个数
    // items: 替换或插入元素（一位或多位）
    var arr1 = [1, 2, 3, 4];
    // a. 插入元素: 从下标0开始 删除0个元素 插入一个元素
    arr1.splice(0, 0, '我是插入元素1');
    console.log(arr1); // ["我是插入元素1", 1, 2, 3, 4]

    // b. 插入多个元素：从下标2开始 删除0个元素 插入两元素
    arr1.splice(2, 0, '我是插入元素2', '我是插入元素3');
    console.log(arr1); // ["我是插入元素1", 1, "我是插入元素2", "我是插入元素3", 2, 3, 4]

    // c. 删除元素：从下标0开始 删除一个元素
    arr1.splice(0, 1);
    console.log(arr1); // [1, "我是插入元素2", "我是插入元素3", 2, 3, 4]

    // d. 删除多个元素：从下标2开始 删除两个元素
    arr1.splice(2, 2);
    console.log(arr1); // [1, "我是插入元素2", 3, 4]

    // e. 删除元素后进行插入：从下标0开始 删除两个元素 插入两个元素 实现元素替换
    arr1.splice(0, 2, '我是插入元素4', '我是插入元素5');
    console.log(arr1); // ['我是插入元素4', '我是插入元素5', 3, 4]

    // f. 删除数组中的倒数第二个元素
    arr1.splice(arr1.length - 2, 1);
    console.log(arr1); // ["我是插入元素4", "我是插入元素5", 4]

    // f. 删除元素：从数组中的第一个元素开始，删除后面的所有元素
    arr1.splice(1);
    console.log(arr1); // ['我是插入元素4']


    // 4. slice() 方法会返回一个新的数组对象，从begin开始截取，一直到end，如果end不填，一直到数组结尾 (浅拷贝)
    // begin: 开始下标
    // end: 第几个元素结束 

    // a. 从下标0开始，到第三个元素结束
    var arr1 = [1, 2, 3, 4, 5, 6, 7];
    console.log(arr1.slice(0, 3)); // [1, 2, 3]

    // b. 从下标0开始，截取到数组结尾
    console.log(arr1.slice(0)); // 全数组    
  </script>
</head>

<body>

</body>

</html>